<div class="page-content">
    <div class="panel panel-default">
        <div class="panel-heading"> <strong>添加视频</strong> </div>
        <div class="panel-body">
            <style>
            .progress_complete {
                border: 1px solid #B9B9B9;
                border-radius: 3%;
                margin-bottom: 20px;
                overflow: hidden;
                background-color: #f5f5f5;
                border-radius: 4px;
                padding: 5px;
            }
            
            .progress_complete p {
                margin: 0px;
            }
            </style>
            <form enctype="multipart/form-data" class="form-horizontal" id="video_from" action="<{:addons_url('Upload/Index/upload_video')}>" method="post">
                <div class="form-group">
                    <div class="col-sm-6" style="position:relative">
                       <!--  <a class="btn btn-default"> <i class="fa fa-plus"></i>选择视频</a> -->
                        <input onchange="video_from()" type="file" name="imgFile" id="video_from_file" />
                    </div>
                </div>
                
                <p>上传进度：<span id="upload_tip"></span></p>
                <div class="progress_list">
                    <div class="progress_one">
                        <div class="progress">
                            <div class="progress-bar progress-bar-striped active" id="video-progress-bar" role="progressbar" aria-valuenow="45" aria-valuemin="0" aria-valuemax="100" style="width:0%"> <span class="sr-only">0% </span> </div>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-6" align="center"> 
<input type="submit" name="提交" class="btn btn-default">
                   
                    </div>
                </div>
                <div class="clearfix"></div>
            </form>
            <div class="clearfix"></div>
        </div>
    </div>
</div>
<script>
var mysetInterval;

function video_from() {
    // var options = {
    //     //  target: '#output',          //把服务器返回的内容放入id为output的元素中      
    //     beforeSubmit: showRequest, //提交前的回调函数  
    //     success: function(response) {
    //         clearInterval(mysetInterval);
    //         UploadComplete(response); //上传完成
    //     }, //提交后的回调函数  
    // }
    // $("#video_from").ajaxSubmit(options);

}

$("#video_from").submit(function(event) {
	$("#video-progress-bar").width("0%");
    $(".sr-only").text("0%");
    mysetInterval=setInterval(uploading,3000);
    $('[type="submit"]').val("上传中...");
});


//完成上传了
function UploadComplete(response) {
    var json = eval('(' + response + ')');
    if (json.error > 0) {
        dialog(json.msg);
        return false;
    }
    // console.log(json);
    var html = '<div class="progress_complete"><p>' + json.data.fileName + json.data.FlagString + '</p><p>' + json.data.location + '</p></div></div>';
    $(".progress_list .progress_one").html(html);
    $(document).trigger("videoUploadSuceess", [json]);
}
//上传中
function uploading() {
    var fileName_str = $("#video_from_file").val();
    var pos = fileName_str.lastIndexOf("\\") * 1;
    if (pos == -1) {
        pos = fileName_str.lastIndexOf("/") * 1;
    }
    fileName = fileName_str.substring(pos + 1);
    $.getJSON("<{:addons_url('Upload/Index/progress')}>", {
        fileName: fileName
    }, function(data) {
        $("#video-progress-bar").width(data + "%");
        $(".sr-only").text(data + "%");
        $("#upload_tip").text(data + "%");
    })
}
</script>
